<template>
  <div>
    <h2>侦听器</h2>
    <input type="text" v-model="uname" />
  </div>
</template>

<script>
  export default {
    data() {
      return {
        uname:'吱吱'
        //对象在内存中 存的是地址  所以需要深度侦听抓捕数据是否有变化
        dog:{
          name:'毛蛋',
          age:2
        }
      }
    },
    watch:{
      //写对象格式
      uname: {
        handel(val){
          console.log(val);
        }
      },
      immediate:true,//立即侦听,页面打开,马上就执行一次侦听器函数

      dog:{
        handel(val){
          console.log(val)
        },
        deep:true //表示深度侦听,当对象的任意属性改变后,都会触发该侦听器
      }


      //只侦听某个对象的一个属性时:
      // 'dog.name'(val){
      //   console.log(val);
      // }
    }
  }
</script>

<style lang="scss" scoped>
</style>